<script setup lang="ts">
import { onMounted } from 'vue'
import {
  NConfigProvider,
  NMessageProvider,
  NNotificationProvider,
  NDialogProvider,
  zhCN,
  dateZhCN
} from 'naive-ui'
import { useThemeStore } from '../stores/theme'

// 使用主题 store
const themeStore = useThemeStore()

// 组件挂载时初始化
onMounted(() => {
  // 初始化系统主题检测
  themeStore.initSystemThemeDetection()
  // 加载保存的主题配置
  themeStore.loadThemeFromConfig()
})
</script>

<template>
  <n-config-provider
    :theme="themeStore.naiveTheme"
    :theme-overrides="themeStore.themeOverrides"
    :locale="zhCN"
    :date-locale="dateZhCN"
  >
    <n-message-provider>
      <n-notification-provider>
        <n-dialog-provider>
          <!-- 插槽内容 -->
          <slot />
        </n-dialog-provider>
      </n-notification-provider>
    </n-message-provider>
  </n-config-provider>
</template>
